
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="sf" uri="http://www.springframework.org/tags/form" %>
<%@taglib prefix="s" uri="http://www.springframework.org/tags" %>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>RRA</title>
        <link rel="stylesheet" type="text/css"
              href="${pageContext.request.contextPath}/resources/css/redmond/jquery-ui-1.8.23.custom.css" />


        <link href="${pageContext.request.contextPath}/resources/css/style.css" rel="stylesheet" type="text/css" />
        <script type="text/javascript" src="${pageContext.request.contextPath}/resources/js/jquery.js"></script>
        <script type="text/javascript" src="${pageContext.request.contextPath}/resources/js/jquery-ui-1.8.22.custom.min.js"></script>

        <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/resources/css/styles.css" />
        <style type="text/css">
            #transactionFormDiv{
                top: -140px;
                left: 405px; 
                width: 500px; 
                position: relative; 
                height: 395px;
            }
            #rraMenuDiv{
                position: relative;
                top: 40px;
                width: 300px;
                height: 200px;

            }

            .dropDown{
                width: 200px;
            }

            #ajax_loading_transForm{
                position: relative;
                top: -18px;
                left: 23px;
                width: 60px;
            }

            #ajax_loading_createEvent{
                position: relative;
                top: -30px;
                left: 260px;
                width: 110px;
                height: 25px;               
            }
        </style>
        <script type="text/javascript">
            $(document).ready(function(){
                
                $('#dateOfPayment').datepicker( {
        
                    changeMonth: true,
                    changeYear: true,                    
                    dateFormat: 'dd-mm-yy',
                    inline: true
        
                });
                
                $("#submitForTransactionDetailsForm").click(function(){
                    
                    if($("#name").val()== '' || $("#locationCode").val()== ''|| $("#dateOfPayment").val()== 0||$("#year").val() == 'Please Select' || $("#amount").val() == ''){
                        if($("#name").val() == ''){
                            alert("Name Field Is Empty");
                            $("#name").focus();
                            return false;
                        }
                        
                        if($("#locationCode").val() == ''){
                            alert("Location Code Field Is Empty");
                            $("#locationCode").focus();
                            return false;
                        }
                        
                        if($("#dateOfPayment").val() == ''){
                            alert("Date Of Payment Field Is Empty");
                            $("#dateOfPayment").focus();
                            return false;
                        }
            
                        if($("#year").val() == 'Please Select'){
                            alert("Year Of Liability Field Is Not Selected");
                            $("#year").focus();
                            return false;
                        }
                     
         
                        if($("#amount").val() == ''){
                            alert("Amount Field Is Empty");
                            $("#amount").focus();
                            return false;
                        }
                    }else{
            
                        $.ajax({
                            type : "post",
                            url : "${pageContext.request.contextPath}/txForm",
                            data : $("#transactionDetailsForm").serialize(),
                            success : function(response){
                    
                                if(response == 'success'){                                   
                                    $("#ajax_loading_createEvent").css("display", "block");
                                    setTimeout(function(){
                                        $("#ajax_loading_createEvent").css("display", "none");
                                        alert("Transaction Hasbeen Saved successfully");
                                        window.location = "${pageContext.request.contextPath}/rraHome/nonFiscal";
                                    }, 3000);
                                }
                            }
                        });
            
                    }
         
                });
                
                
                
                
            });
        </script>

    </head>
    <body>
        <div id="mian_body">
            <div class="main">
                <div class="header">
                    <div class="hbg">
                        <img src="${pageContext.request.contextPath}/resources/images/header-about.png" width="972" height="100" alt="" style="border-radius: 20px 20px 20px 20px;" />
                    </div>
                    <div class="clr"></div>
                </div>
                <div class="content">
                    <div class="content_bg">
                        <div class="mainbar">

                        </div>
                        <div class="sidebar">
                            <div id="rraMenuDiv">
                                <div class="right-nav">
                                    <ul>
                                        <li><a href="${pageContext.request.contextPath}/rraHome/rraLogin">DashBoard</a></li>                                  
                                        <li><a href="#">Reconciliation For E-Tax</a></li>
                                        <li class="current"><a href="#">System For Non-Fiscal Revenue Collection</a></li>
                                        <li><a href="#">Financial Statement For Fiscal and Non-Fiscal</a></li>
                                        <li><a href="#">Accounting System</a></li>                                   
                                    </ul>
                                </div>
                            </div>

                            <div id="transactionFormDiv">
                                <div class="container">
                                    <ul class="options tabs2">
                                        <li id="listOne" class="active"><a href="#tab1">Non-Fiscal Revenue Form</a></li>
                                    </ul>

                                    <div class="tab_container2">

                                        <div id="tab1" class="tab_content2">

                                            <sf:form action="" method="POST" modelAttribute="transactionDetailsForm" id="transactionDetailsForm">

                                                <div class="st-blocked2" >
                                                    <label for="tags">Transaction Number</label>
                                                    <sf:input path="transactionNumber" type="text" size="25" value="${taxCode.taxTypeNumber}" class="tags" name="name" id="transactionNumber" readonly="true"/>
                                                </div>
                                                
                                                <div class="st-blocked2" >
                                                    <label for="tags">Name</label>
                                                    <sf:input path="name" type="text" size="25" value="" class="tags" name="name" id="name"/>
                                                </div>

                                                <div class="st-blocked2" >
                                                    <label for="tags">Location/Region</label>
                                                    <sf:input path="locationCode" type="text" size="25" value="" class="tags" name="locationCode" id="locationCode"/>
                                                </div>

                                                <div class="st-blocked2" >
                                                    <label for="tags">Date Of Payment</label>
                                                    <sf:input path="dateOfPayment" type="text" size="25" value="" class="tags" name="dateOfPayment" id="dateOfPayment" readonly="true"/>
                                                </div>

                                                <div class="st-blocked2" >
                                                    <label for="tags">Revenue Code</label>
                                                    <sf:input path="taxTypeCode" type="text" size="25" value="${taxCode.taxTypeCode}" class="tags" name="taxTypeCode" readonly="true" id="taxTypeCode"/>
                                                </div>

                                                <div class="st-blocked2" >
                                                    <label for="tags">Year Of Liability</label>
                                                    <sf:select path="year" id="year">
                                                        <sf:option value="Please Select" selected="true">Please Select</sf:option>
                                                        <sf:option value="2011">2011</sf:option>
                                                        <sf:option value="2012">2012</sf:option>
                                                        <sf:option value="2013">2013</sf:option>
                                                        <sf:option value="2014">2014</sf:option>
                                                        <sf:option value="2015">2015</sf:option>
                                                        <sf:option value="2016">2016</sf:option>
                                                        <sf:option value="2017">2017</sf:option>
                                                    </sf:select>
                                                </div>

                                                <div class="st-blocked2" style="z-index: 810;">
                                                    <label for="tags">Type Of Tax</label>
                                                    <sf:input path="taxTypeName" type="text" size="25" value="${taxCode.taxTypeName}" class="tags" name="taxTypeName" id="taxTypeName" readonly="true"/>
                                                </div>

                                                <div class="st-blocked2" style="z-index: 810;">
                                                    <label for="tags">Amount</label>
                                                    <sf:input path="amount" type="text" size="25" value="" class="tags" name="amount" id="amount"/>
                                                </div>

                                                <div class="st-blocked2">
                                                    <label for="tags"><br/></label>
                                                    <a class="button-h" href="#" id="submitForTransactionDetailsForm"><span>Submit</span></a>
                                                </div>
                                            </sf:form>
                                            <div id="ajax_loading_createEvent">

                                                <img  src="${pageContext.request.contextPath}/resources/images/spinner.gif"><div id="ajax_loading_transForm">Processing...</img></div>

                                            </div>
                                        </div>                                
                                    </div>
                                </div>



                                <div class="clr"></div>
                            </div>
                        </div>
                        <div class="clr"></div>
                    </div>
                    <div class="clr"></div>
                </div>

                <div class="footer">
                    <div class="footer_resize">
                        <p class="lf">&copy; Copyright <a href="#">MyWebSite</a>.</p>
                        <p class="rf">Layout by Cool <a href="#">Website Templates</a></p>
                        <div class="clr"></div>
                    </div>
                </div>
            </div>
    </body>
</html>